<template>
  <view style="display: flex; flex-direction: column; align-items: center">
    <view class="content">
      <u-image :src="iconSuccess" width="80px" height="80px"></u-image>
      <text style="margin-top: 20rpx">支付成功</text>
    </view>

    <view style="margin-top: 170rpx; width: 70vw">
      <u-button text="查看订单" type="primary" :hairline="true" @click="goOrderDetail"></u-button>
    </view>

    <view style="margin-top: 40rpx; width: 70vw">
      <u-button text="继续购物" @click="goIndex"></u-button>
    </view>
  </view>
</template>

<script setup lang="ts">
import { reactive, ref, watch } from "vue";
import iconSuccess from "@/static/icon_success.png";
import { onLoad } from "@dcloudio/uni-app";

var orderId = null;

onLoad((option) => {
  orderId = option.orderId;
});

function goOrderDetail() {
  uni.redirectTo({
    url: "/pages/order/index",
  });
}

function goIndex() {
  uni.redirectTo({
    url: "/pages/home/index",
  });
}
</script>

<style lang="scss" scoped>
.content {
  width: 100vw;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  font-size: 40rpx;
  font-weight: 600;
  margin-top: 200rpx;
}
</style>
